<template>
  <div class="swipe">
    <swipe :auto="4000" :show-indicators="false">
      <swipe-item>
        <img src="../../assets/imgs/pics/test1.png" alt="">
      </swipe-item>
<!--      <swipe-item>-->
<!--        <img src="../../assets/imgs/pics/test2.png" alt="">-->
<!--      </swipe-item>-->
      <swipe-item>
        <img src="../../assets/imgs/pics/cover1.jpg" alt="">
      </swipe-item>
      <swipe-item>
        <img src="../../assets/imgs/pics/cover2.jpg" alt="">
      </swipe-item>
    </swipe>
  </div>
</template>

<script>
import { Swipe, SwipeItem } from 'mint-ui'

export default {
  name: "Swipe",
  data () {
    return {

    }
  },
  components: {
    'swipe': Swipe,
    'swipe-item': SwipeItem
  }
}
</script>



<style scoped>
  .swipe{
    height: 17rem;
  }
  .mint-swipe{
    height: 100%;
    width: 100%;
  }
  .mint-swipe-items-wrap{
    height: 100%;
    width: 100%;
   }
  .mint-swipe-item{
    height: 100%;
    width: 100%;
  }
  .mint-swipe-item img{
    /*height: 100%;*/
    min-height: 17rem;
    width: 100%;
    /*overflow: hidden;*/
  }
</style>